<script setup lang="ts">
import { getDetail } from '@/api/oa/notifyAnnouncement';
import { useTitle } from '@vueuse/core';

const props = defineProps<{
	id?: string;
}>();

const route = useRoute();
const router = useRouter();
const info = ref({} as any);
const title = useTitle();

onMounted(async () => {
	const id = props.id || (route.query.id as string);
	try {
		const res = await getDetail(id);
		info.value = res.data;
		if (!props.id) {
			title.value = info.value.title;
		}
	} catch {
		router.push('/404');
	}
});
</script>

<template>
	<div class="p-3 text-[#333]">
		<h1 class="text-3xl font-bold">{{ info.title }}</h1>
		<p class="my-2 text-[#666]">
			<span>{{ info.createBy }}</span> 发布于 <span>{{ info.createTime }}</span>
		</p>
		<div v-if="info.content" v-html="info.content" />
	</div>
</template>
